<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>医院诊疗系统</title>
  <link rel="stylesheet" href="./css/layui.css">
  <script src="./layui.js"></script>
  <script src="./js/jquery-3.5.1.js"></script>

</head>
<body>
<div  id="lbody"  class="layui-layout layui-layout-admin">
  <!-- 头部区域（可配合layui 已有的水平导航） -->
  <div class="layui-header">
    <div class="layui-logo layui-hide-xs layui-bg-black">医院诊疗系统</div>
    
    <ul class="layui-nav layui-layout-left">
      <!-- 移动端显示 -->
      <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
        <i class="layui-icon layui-icon-spread-left"></i>
      </li>
      
      <li class="layui-nav-item layui-hide-xs "><a href="doctor_pending.html">门诊管理</a></li>
      <li class="layui-nav-item layui-hide-xs"><a href="medical_card.html">费用管理</a></li>
      <li class="layui-nav-item layui-hide-xs"><a href="drug_in_storage.html">药库管理</a></li>
      <li class="layui-nav-item layui-hide-xs layui-this"><a href="">管理员</a></li>
     
    </ul>



    <!-- 右上角导航栏 -->
    <ul class="layui-nav layui-layout-right">
      
      <li class="layui-nav-item layui-hide layui-show-md-inline-block">
        <a href="javascript:;">
          <img src="image/gly.jpg" class="layui-nav-img">
          管理员
        </a>
        <dl class="layui-nav-child">
          <dd><a href="">修改密码</a></dd>
          <dd><a id="edit">编辑信息</a></dd>
          <dd><a href="">退出登录</a></dd>
        </dl>
      </li>
      
    </ul>
    <!-- 右上角导航栏 -->
    
  </div>
   <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
  
  
  <!-- 内容主体区域 -->
<div class="" style="padding: 15px; width: 98%; padding-top: 70px;">
 
  <div>
    <form action="" class="layui-form">
      
      <div class="layui-form-item">
        <div class="layui-inline">
          <label class="layui-form-label">标题:</label>
          <div class="layui-input-inline">
            <input type="text" placeholder="请输入标题" class="layui-input" style="width: 400px;">
          </div>
        </div>
        <div class="layui-form-label">发送对象</div>
        <div class="layui-input-inline" style="width: 200px;">
            <select name="province" class="province-selector" data-value="全体成员" lay-filter="province-1">
               <option value="">全体患者</option>
               <option value="">全体医生</option>
               <option value="">全体费用管理员</option>
               <option value="">全体药库管理员</option>
               <option value="">全体成员</option>
            </select>
        </div>
      </div>
      <div class="layui-form-item layui-form-text" style="padding-right: 20px;">
        <label class="layui-form-label">详细内容:</label>
        <div class="layui-input-block">
          <textarea placeholder="请输入内容" class="layui-textarea" name=""></textarea>
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-input-block">
          <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">发布</button>
          <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
      </div>
    </form>

  </div>


  <blockquote class="layui-elem-quote" style="margin-top: 10px;">
    账号角色管理
  </blockquote>

  

     
<div style="padding:20px">
  <table class="layui-hide" id="test" lay-filter="test"></table>

</div>



</div>
  
  <!-- 主体 -->
  
</div>





<!-- // 表格处理 -->


 
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除账户</a>
  
</script>
              
    
 
<script>
  var a;
layui.use('table', function(){
  var table = layui.table;
  var table_data = [];
  let $ = layui.jquery;
  $.ajax({
    url: "/user/search",
    type: "get",
    contentType:'application/json;charset=UTF-8',
    // data: JSON.stringify(obj.data),
    dataType: "json",
    success: function(data) {
      let length = data.length
      var yh_type;
      var yh_sex;
      for (var i = 0; i < length; i++) {
        yh_type = data[i]['yh_type']
        let role = "";
        switch (yh_type) {
          case 0:
            role = "管理员";
            break;
          case 1:
            role = "病人";
            break;
          case 2:
            role = "医生";
            break;
          case 3:
            role = "费用管理员";
            break;
          case 4:
            role = "药库管理员";
            break;
        }
        yh_sex = data[i]['yh_sex']
        let sex = ""
        switch (yh_sex) {
          case 0:
            sex = "女";
            break;
          case 1:
            sex = "男";
            break;
        }

        let temp_data = {
          "phone": data[i]['yh_phone'],
          "username": data[i]['yh_name'],
          "role": role,
          "sex": sex,
          "id_number": data[i]['yh_idCard'],
          "location": data[i]['yh_address'],
        };

        table_data.push(temp_data)
      }
      console.log(table_data)
      table.reload("test", {
        where: {
          data: table_data
        }
      })
    },
  })

  
  table.render({
    elem: '#test'
    // ,url:'mods/table/user/a.json'   //数据来源接口
    
    ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
    ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
      title: '提示'
      ,layEvent: 'LAYTABLE_TIPS'
      ,icon: 'layui-icon-tips'
    }]
    ,title: '用户数据表'
    ,cols: [
      [  //表头
    {type: 'checkbox', fixed: 'left'}
      ,{field: 'phone', title: '手机号', width:130, align:'center',sort: true, fixed: 'left'}
      ,{field: 'username', title: '姓名', align:'center',width:110}
      ,{field: 'role', title: '角色', align:'center',width:120}
      ,{field: 'sex', title: '性别',align:'center', width:80}
      ,{field: 'id_number', title: '身份证号', width: 190, align:'center'}
      ,{field: 'location', title: '地址',align:'center', width:300} 
      ,{fixed: 'right', title:'<a id="add-form" class="layui-btn layui-btn-xs" lay-event="edit">添加账户</a>' , width: 160, align:'center', toolbar: '#barDemo'}
    ]
  ]
    ,page: true
    ,data: table_data
    // ,data:[
    //     {
    //         "phone": "13005681230",
    //         "username": "张珊",
    //         "role":"病人",
    //         "sex": "女",
    //         "id_number": "440923111903011230",
    //         "location": "广东省-东莞市-松山湖管委会-东莞理工学院"
    //     },
    //
    //     {
    //         "phone": "13005681231",
    //         "username": "张三",
    //         "role":"管理员",
    //         "sex": "男",
    //         "id_number": "440923111903011231",
    //         "location": "广东省-东莞市-松山湖管委会-东莞理工学院"
    //     },
    //
    //            {
    //                "phone": "13005681234",
    //                "username": "李四",
    //                "role":"管理员",
    //                "sex": "男",
    //                "id_number": "440923111903011245",
    //                "location": "广东省-东莞市-松山湖管委会-东莞理工学院"
    //            }
    // ]
  });
  
  


  table.on('tool(test)',function(obj){
    var d = obj.data;
    if(obj.event === 'del'){//event对应按钮中的lay-event
      layer.confirm('真的删除账户吗？', function(index){
        //在此更新数据库

        // console.log(obj)
        $.ajax({
          url: "/user/delete?idCard="+obj.data["id_number"],
          type: "get",
          contentType: 'application/text;charset=UTF-8',
          success: function (data) {

          },
        })

        obj.del();
        layer.close(index);
      });
    }
  });
  //监听行工具事件
  $(document).on('click','#add-form', function(obj){
    layer.open({
        type: 2,
        title:'填写详细信息',
        area: ['1140px', '180px'],
        fixed: false, //不固定
        maxmin: true,
        scrollbar:false,
        content: 'add_role.html'

      });
    
    return true;
  });
});
</script>


<!-- // 表格处理 -->



<!-- 消息样式 -->





<!-- 角色选择框 -->

<!-- 修改信息事件 -->
<script>
  $("#edit").on('click',function(e){
    //打开窗口
    layer.open({
            type: 2,
            area: ['1000px', '600px'],
            fixed: false, //不固定
            maxmin: true,
            title:"个人信息",
            content: 'edit_information.html'
            // 3.父传子值
            //  success:function(layero, index){
            //       //关键在这，调用子的iframe的方法，进行传参,前两行固定写法
            //       var body = layer.getChildFrame('body', index);
            //       var iframeWin = window[layero.find('iframe')[0]['name']];
            //       var div=$(obj).text();
            //       iframeWin.childIframe(div);    //看这
            //   }
      });
  });

</script>

</body>
</html>